<template>
	<view>
		<uni-search-bar :radius="100" cancelButton="false" @confirm="search"></uni-search-bar>	
		<view class="list" v-for="(item, index) in listItem" :key="index">
			<view class="listItem">
				<view class="checkbox fl">
					<evan-checkbox :v-model="item.value"></evan-checkbox>
				</view>
				<view class="content fl">
					<view class="top">
						<view class="conLe fl">{{item.title}}</view>
						<view class="conRe fr">CNY {{item.money}}</view>
					</view>
					<view class="btm">
						<view class="conLe fl">{{item.time}}|{{item.money}}</view>
						<view class="conRe fr">{{item.desc}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="btmBtn">
			<button class="btn">确定(0)</button>
		</view>
	</view>
</template>

<script>
	import evanCheckbox from "@/components/evan-checkbox/evan-checkbox.vue"
	export default {
		components: {
			evanCheckbox
		},
		data() {
			return {
				listItem: [
					{
						value: '',
						title: '出差借款',
						money: '10,000.00',
						time: '2020-12-31',
						desc: '本次核销'
					},
					{
						value: '',
						title: '差旅费申请',
						money: '798.00',
						time: '2020-12-31',
						desc: '本次核销'
					},
					{
						value: '',
						title: '出差借款',
						money: '900.00',
						time: '2020-12-31',
						desc: '本次核销'
					}
				]
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
	@import "@/pages/add/add.scss";
.list{
	width: 100%;
	height: 140rpx;
	box-sizing: border-box;
	padding: 0 12px;
	background-color: #FFFFFF;
	overflow: hidden;
	border-bottom: 1px solid #f1f1f1;
	.checkbox{
		width: 10%;
		padding-top: 50rpx;
	}
	.content{
		width: 90%;
		height: auto;
		overflow: hidden;
		.top{
			overflow: hidden;
			@include divH(90rpx);
			font-weight: bold;
		}
		.btm{
			@include divH(40rpx);
			font-size: 14px;
			color: #999;
		}
	}
}
.btmBtn{
	width: 100%;
	@include posFixedBtm();
	.btn{
		width: 90%;
		margin-left: 5%;
		color: #FFFFFF;
		background-color: $themeColor;
		margin-bottom: 12px;
	}
}
</style>
